<template>
    <div>
        <h3>显示页面</h3>

        <a href="/add">新增页面</a>

        <input type="text" placeholder="名称" v-model="cx.ename">
        <input type="text" placeholder="颜色" v-model="cx.ecolour">
        <input type="button" value="查询" @click="getdata">
        <table class="table">
            <thead>
                <tr>
                    <td>编号</td>
                    <td>优惠券名称</td>
                    <td>结束日期</td>
                    <td>优惠券颜色</td>
                    <td>优惠券描述</td>
                    <td>操作</td>
                </tr>
            </thead>
            <tbody>
                <tr v-for="g in data">
                    <td>{{ g.Eid }}</td>
                    <td>{{ g.Ename }}</td>
                    <td>{{ moment(g.Edate).format("YYYY-MM-DD") }}</td>
                    <td>{{ g.Ecolour }}</td>
                    <td>{{ g.Emiao }}</td>
                    <td>
                        <input type="button" value="删除" @click="del(g.Eid)">
                        <input type="button" value="修改" @click="up">
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
</template>

<script setup lang="ts">

import {ref,onMounted} from 'vue'
import {useRouter} from 'vue-router'
import axios from 'axios'
import moment from 'moment'

const data=ref(
    [
  {
    "Eid": 0,
    "Ename": "",
    "Edate": "",
    "Ecolour": "",
    "Emiao": ""
  }
]
)

const cx=ref(
    {
        ename:"",
        ecolour:""
    }
)

onMounted(() => {
    getdata()
})

const getdata=()=>{
    axios.get("https://localhost:7087/api/Emp/List",{params:cx.value}).then(res=>{
        data.value=res.data
    })
}

const del=(val:any)=>{
    axios.delete("https://localhost:7087/api/Emp/Delete",{params:{id:val}}).then(res=>{
        if(res.data>0)
        {
            alert("删除成功");
            getdata()
        }
        else
        {
            alert("删除失败");
        }
    })
}

</script>

<style scoped>

</style>